<template>
	<div>
    <el-form :inline="true">
      <el-form-item>
        <el-input
            v-model="searchForm.title"
            placeholder="搜索活动"
            clearable
        >
        </el-input>
      </el-form-item>

      <el-form-item>
        <el-button @click="getActivityList">搜索</el-button>
      </el-form-item>
    </el-form>

    <el-table
        ref="multipleTable"
        :data="tableData"
        tooltip-effect="dark"
        style="width: 100%"
        border
        stripe
        @selection-change="handleSelectionChange">

      <el-table-column
          type="selection"
          width="55">
      </el-table-column>

      <el-table-column
          prop="title"
          label="标题"
          width="50">
      </el-table-column>

      <el-table-column
          prop="context"
          label="主要内容"
          width="120">
      </el-table-column>

      <el-table-column
          prop="image"
          label="图片"
          width="100">
        <template slot-scope="scope">
          <img :src="'http://localhost:9000/api/file/' +scope.row.image" style="width: 80px; margin-top: 10px;"
               alt="图片">
        </template>
      </el-table-column>
      <el-table-column
          prop="address"
          label="地址">
      </el-table-column>
      <el-table-column
          prop="endTime"
          label="截止时间">
      </el-table-column>

      <el-table-column
          prop="status"
          label="状态"
          width="80">
        <template slot-scope="scope">
          <el-tag size="small" v-if="scope.row.status === 0" type="warning">未审核</el-tag>
          <el-tag size="small" v-else-if="scope.row.status === 1" type="success">已审核</el-tag>
          <el-tag size="small" v-else-if="scope.row.status === 2" type="danger">未通过</el-tag>
        </template>

      </el-table-column>
    </el-table>
  </div>
</template>

<script>
	export default {
		name: "Index",
    data(){
      return {
        loading: false,
        tableData: [],
        searchForm: {},
        total: 0,
        size: 10,
        current: 1,
      }
    },
    methods: {
      getActivityList() {
        this.loading = true;
        const customHeaders = {};
        this.$axios.get("/sys/activity/list/user", {
          params: {
            keyword: this.searchForm.title,  // 传递搜索关键词至后端
            current: this.current,
            size: this.size
          },
          headers: customHeaders
        }).then(res => {
          this.tableData = res.data.data.records;
          this.size = res.data.data.size;
          this.current = res.data.data.current;
          this.total = res.data.data.total;
        }).catch(err => {
          console.error('加载错误', err);
        }).finally(() => {
          this.loading = false;
        });
      },
      handleSelectionChange(val) {
        console.log("勾选")
        console.log(val)
        this.multipleSelection = val;

        this.delBtlstatus = val.length == 0
      },
    },
    created() {
      this.getActivityList()
    }
	}
</script>

<style scoped>



</style>
